<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no">
<link rel="stylesheet" type="text/css" href="static/css/style.css" />
<script type="text/javascript" src="static/js/jquery-3.3.1.min.js"></script>
<script type="text/javascript" src="static/js/share.js"></script>
<script type="text/javascript" src="//api.map.baidu.com/api?ak=htWvwYPknA71cGYsWv6QnlzQ&type=lite&v=1.0"></script>
<title>巧匠部落招工信息</title>
</head>
<body>
	<div class="warp">
    	<div class="install_tip_top">
        	<div class="logo_ico"></div>
            <div class="logo"></div>
            <div class="info">中国首个工匠综合服务平台</div>
            <a class="intsll_btn" href="javascript:void(0)" onclick="share.download('http://image.qjbuluo.com/o_1da695eu21jg0j3310pbd5rtcua.apk', '')">免费安装</a>
        </div>
        <div class="zginfobox">
            <div class="loading"></div>
        </div>
        <div class="zw60"></div>
        <div class="botton_menubox1">
            <ul>
                <li class="share"></li>
                <li class="fav"></li>
            </ul>
            <a href="javascript:void(0)" class="chat">在线咨询</a>
            <a href="javascript:void(0)" class="tel"></a>
        </div>
    </div>
<script type="text/javascript">
var id = share.get_param('id');
if(!id) {
    alert('系统错误');
}
function init_info(data) {
    var init_st_str = function(status) {
        var str = '';
        switch(parseInt(status)) {
            case 0:
                str='招工中'
                break;
            case 1:
                str='已招满'
                break;
            case 2:
                str='已过期'
                break;
            case 3:
                str='推荐'
                break;
            case 3:
                str='已下架'
                break;
        }
        return str
    }
    var tj_zg_init = function(list) {
        var html = '';
        if(list.length > 0) {
            $.each(list,function(index,value){
                html+='\
                    <li>\
                        <dl>\
                            <dt>'+value.summary+'</dt>\
                            <dd>\
                                <p>'+(value.province ? value.province : '')+(value.city ? value.city : '')+(value.area ? value.area : '')+'  |  包工</p>\
                                <p>\
                                    <i class="tab">'+value.ageRange+'岁</i>\
                                    <i class="tab">'+value.sexRequire+'</i>\
                                </p>\
                            </dd>\
                        </dl>\
                        <div class="price">\
                            <p class="font1"><strong>￥'+value.price+'</strong>/天</p>\
                            <p class="font2">工资'+(typeof(value.payType) != 'undefined' ? value.payType+'结' : '-')+'</p>\
                        </div>\
                    </li>\
                ';
            })
        } else {
            html += '\
                <div class="no_log_tip">暂无信息</div>\
            ';
        }
        
        return html;
    }
    var init_comments = function(data) {
        var html = '<ul class="comment_list">';
        if(data.comments.length > 0) {
            $.each(data.comments,function(index,value){
                var commentContent = '';
                switch(value.category) {
                    case 0:
                        commentContent = '<span class="username3">'+value.userName+'</span>取消了点赞.';
                        break;
                    case 1:
                        commentContent = '<span class="username3">'+value.userName+'</span>赞了这条动态';
                        break;
                    case 2:
                        commentContent = '<div class="hbinfo">'+value.userName+'给'+value.targetName+'打赏了一个红包.</div>';
                        break;
                    case 3:
                        commentContent = '<span class="username3">'+value.userName+'</span>分享了此动态.';
                        break;
                    case 4:
                        commentContent = value.content;
                        break;
                }
                html+='\
                    <li>\
                        <a href="userprofile.html?id='+ value.userId +'" class="avatar" style="background-image:url('+value.userHead+')"></a>\
                        <div class="comment_text">\
                            <div class="username">'+ value.userName +'</div>\
                            <div class="sty2">\
                                '+commentContent+'\
                                <p class="note1">'+value.createTime +'</p>\
                            </div>\
                            <div class="red_bag2 '+(value.awarded ? 'active' : '')+'"><span class="nums">'+(value.award > 0 ? value.award : '')+'</span></div>\
                            <div class="approve2 '+(value.agreed ? 'active' : '')+'"><span class="nums">'+(value.agree > 0 ? value.agree : '')+'</span></div>\
                        </div>\
                    </li>\
                ';
            })
        } else {
            html += '\
                <div class="no_log_tip">万水千山总是情，给个评论行不行</div>\
            ';
        }
        html = html + '</ul>';
        return html;
    }
    var init_content = function(list) {
        var html = '';
        $.each(list,function(index,value){
            switch(parseInt(value.type)) {
                case 0:
                    html += '<p>'+value.content+'</p>';
                    break;
                case 1:
                    html += '<p><img src="'+value.content+'" /></p>';
                    break;
                case 2:
                    html += '\
                        <p>\
                            <video onended="complete_play(this)" preload="auto" playsinline="true" x5-video-player-type="h5" controls >\
                                <source src ="'+value.content+'" type="video/mp4">\
                             Your browser does not support the video tag.\
                            </video>\
                        </p>\
                    ';
                    break;
                case 3:
                    html += '<p><audio src="'+value.content+'" controls ></audio></p>';
                    break;
            }
        })
        return html;
    };
    var html = '';
    html += '\
        <div class="zg_detail_t">\
            <div class="timebox">\
                发布时间：'+data.updateTime+'\
            </div>\
            <h4>\
                <p>'+data.summary+'</p>\
                <i>'+init_st_str(data.status)+'</i>\
                <a href="javascript:void(0)" class="share"></a>\
            </h4>\
        </div>\
        <div class="zg_detail_pricebox">\
            <div class="rmbbox"><strong>'+(data.price ? data.price : '面议')+'</strong>'+(data.price ? '/天' : '')+'</div>\
            <div class="jsbox">结算：'+(typeof(data.payType) != 'undefined' ? data.payType+'结' : '-')+'</div>\
        </div>\
        <div class="zg_detail_info1">\
            <dl class="linebox">\
                <dd class="rs">\
                    <div class="p1">人数：'+data.peopleNumber+'人</div>\
                </dd>\
                <dd class="gz">\
                    <div class="p1">方式：'+(typeof(data.payType) != 'undefined' ? data.payType+'结' : '-')+'</div>\
                </dd>\
            </dl>\
            <dl class="linebox">\
                <dd class="xb">\
                    <div class="p1">性别：'+data.sexRequire+'</div>\
                </dd>\
                <dd class="nl">\
                    <div class="p1">年龄：'+data.ageRange+'岁</div>\
                </dd>\
            </dl>\
            <dl class="linebox">\
                <dd class="dq">\
                    <div class="p1">地点：'+(data.province ? data.province : '')+'  '+(data.city ? data.city : '')+'  '+(data.area ? data.area : '')+'</div>\
                    <div class="p2">'+data.location+'</div>\
                    '+(data.dist ? '<div class="p2">距离 '+data.dist+'km</div>' : '')+'\
                </dd>\
            </dl>\
        </div>\
        <div class="zg_detail_map">\
            <div id="map_container"></div>\
        </div>\
        <div class="zg_detail_xq">\
            <div class="bt">招工详情</div>\
            <div class="ypbox">\
               '+(typeof(data.audioUrl) != 'undefined' && data.audioUrl.length > 0 ? '<audio src="'+data.audioUrl+'" controls ></audio>' : '')+'\
            </div>\
            <div class="zg_detail_content">\
                '+init_content(data.entries)+'\
            </div>\
            <div class="zg_detail_zgf">\
                <div class="t">招工方:</div>\
                <div class="conbox" data-id="'+data.userId+'">\
                    <div class="avatar" style="background-image:url('+data.userHead+')"></div>\
                    <div class="userinfo">\
                        <div class="username">\
                            <h5>'+data.userName+'</h5>\
                            <i class="star4"></i>\
                        </div>\
                        <p>查看TA的所有招工</p>\
                    </div>\
                </div>\
            </div>\
            <div class="zg_detail_note1">\
                <h5>温馨提示</h5>\
                <p>巧匠部落只提供招工信息，双方联系时需辨别真假，建议发生金钱关系时微信视频聊天，视频里看双方身份证，看车票，看工地，看图纸。视频的时候让朋友录下来作为证据。同时为最大限度保证真实，巧匠部落的招工信息不可删除。</p>\
            </div>\
        </div>\
        <div class="zg_detail_tj">\
            <div class="t">推荐招工:</div>\
            <ul class="zglist">\
                '+tj_zg_init(data.recommends)+'\
            </ul>\
        </div>\
        <div class="shop_detail_pl">\
            <div class="title">\
                <h4>评论 <span>'+(parseInt(data.comment) > 0 ? '('+data.comment+')' : '')+'</span></h4>\
                <a href="javascript:void(0)" class="showMore">查看更多</a>\
            </div>\
            <div class="comment_box">\
                <a href="javascript:void(0)" class="avatar"></a>\
                <input placeholder="快来写下你的评论吧~" type="text" disabled />\
            </div>\
            '+init_comments(data)+'\
        </div>\
    ';
    $('.zginfobox').append(html);
    //创建地图
    share.creat_map('map_container', data.longitude, data.latitude);
    zg_bind();
}
function zg_bind() {
    $('.zginfobox .share').on('click', function(){
        alert('下载APP使用此功能.')
    })
    $('.zginfobox .dq').on('click', function(){
        alert('下载APP使用此功能.')
    })
    $('.zginfobox .zg_detail_zgf .conbox').on('click', function(){
        alert('下载APP查看招工信息.')
    })
    $('.zginfobox .zglist li').on('click', function(){
        alert('下载APP查看招工信息.')
    })
    $('.shop_detail_pl .showMore').on('click', function(){
        alert('下载APP查看更多评论信息.')
    })
    $('.shop_detail_pl .comment_box').on('click', function(){
        alert('下载APP参与评论.')
    })
    $('.zginfobox .red_bag2').on('click', function(){
        alert('下载APP使用此功能.')
    })
    $('.zginfobox .approve2').on('click', function(){
        alert('下载APP使用此功能.')
    })
    $('.botton_menubox1').on('click', function(){
        alert('下载APP使用此功能.')
    })
}
function get_info(id) {
    $('.zginfobox .loading').show();
    var obj = {
        url: share.get_api_url()+'work/detail/' + id,
        success: function(data) {
            if(parseInt(data.status) != 0) {
                share.add_tip_a($('.zginfobox'), data.msg);
            } else if (parseInt(data.status) == 0) {
                share.remove_tip();
                init_info(data.result);
            }
            
        },
        complete : function() {
            $('.zginfobox .loading').hide();
        }
    }
    share.ajax_control(obj);
}
$(function(){
    get_info(id);
})
</script>
</body>
</html>
